<html>
<wicket:extend>
<div class="top-links">

  <a wicket:id="mainButton" class="gray-button" href="#">Aquaponics Main</a>
  <a class="green-button" href="#">Aquaponics Statistics</a>
  
  <a class="icon-right" href="#" onClick="helpPopUp();return false;"><img wicket:id="help" /></a>
  <a class="icon-right" href="#" onClick="window.location.reload();return false;"><img wicket:id="refresh" /></a>
  <a class="icon-right" href="#" onClick="window.print();return false;"><img wicket:id="printer" /></a>
  <div class="clear"></div>
</div>

<h1>Aquaponics Statistics and Graphs</h1>

<div class="column-two">
  <div class="inner">
    <div class="tab-wrapper" id="tabset-2">
      <ul class="tabs">
        <li class="tab-1"><a href="#">Day/Current Status</a></li>
        <li class="tab-2"><a href="#">Week</a></li>
        <li class="tab-3"><a href="#">Month</a></li>
        <li class="tab-4"><a href="#">Year</a></li>
      </ul>
      <ul class="tab-content">
        <li class="content-1">
          <h5 wicket:id="dayChartType">[Tab 1]</h5>
          <p>
          <img wicket:id="dayGraphImage"/>
          </p>
          <div class="clear"></div>
        </li>
        <li class="content-2">
          <h5>Water Reserves (Week)</h5><p>Similar to Day/Current Status tab<br /><br /><br /><br /><br /></p>
        </li>
        <li class="content-3">
          <h5>Water Reserves (Month)</h5><p>Similar to Day/Current Status tab<br /><br /><br /><br /><br /></p>
        </li>
        <li class="content-4">
          <h5>Water Reserves (Year)</h5><p>Similar to Day/Current Status tab<br /><br /><br /><br /><br /></p>
        </li>
      </ul>
      <div class="clear"></div>
    </div>
  </div>
</div>

<div class="column-two">
  <div class="inner" style="padding-top:30px;">
  	<table class="bare" style="width:100%;">
    	<tr>
      	<td>
          <div class="column-button">
            <a class="gray-button" href="#" style="width:150px;" wicket:id="dayReservesGraph">H<sub>2</sub>O Reserves</a>
            <a class="gray-button" href="#" style="width:150px;" wicket:id="dayTemperatureGraph">Temperature</a>
            <a class="gray-button" href="#" style="width:150px;" wicket:id="dayPhGraph">pH</a>
            <a class="gray-button" href="#" style="width:150px;" wicket:id="dayConductivityGraph">Conductivity</a>
            <a class="gray-button" href="#" style="width:150px;" wicket:id="dayPowerGraph">Power</a>
            <a class="gray-button" href="#" style="width:150px;" wicket:id="dayWaterGraph">Water Quality</a>
          </div>
        </td>
        <td style="width:100%;">
          <div class="box">
            <h3 wicket:id="detailTitle">[Title]</h3>
            <div class="box">
              <div wicket:id="detailsText">[TEXT GOES HERE]</div>
            </div>
          </div>
        </td>
      </tr>
    </table>
  </div>
</div>
	  
  
</wicket:extend>
</html>

